<template>
  <div class="app-container">
    <el-tabs v-model="activeTab" @tab-change="handleTabChange">
      <el-tab-pane label="个人赛道" name="individual">
        <individualrecord :competition-id="competitionId" :competition-name="competitionName"></individualrecord>
      </el-tab-pane>
      <el-tab-pane label="团队赛道" name="team">
        <teamrecord :competition-id="competitionId" :competition-name="competitionName"></teamrecord>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script setup>
import { ref } from 'vue'
import { useRoute } from 'vue-router'
import individualrecord from '@/views/competitionmanagement/individualrecord/index.vue'
import teamrecord from '@/views/competitionmanagement/teamrecord/index.vue'

const route = useRoute()
const activeTab = ref('individual')

// 获取路由参数
const competitionId = route.query.competitionId
const competitionName = route.query.competitionName

function handleTabChange(tabName) {
  activeTab.value = tabName;
}
</script>

<style scoped>
</style>